<%-- 
    Document   : storeMenu
    Created on : Feb 25, 2015, 5:27:03 PM
    Author     : vinod
--%>

<%@page import="org.shop.domain.Administrator"%>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Shop Inventory | Store Menu</title>
        <link type="text/css" rel="stylesheet" href="css/semantic.min.css"/>
        <script type="text/javascript" src="js/jquery.js"></script>
        <script type="text/javascript" src="js/jquery-ui.min.js"></script>
        <script type="text/javascript" src="js/semantic.min.js"></script>
        <script type="text/javascript">
            $(document).ready(function() {
                $.getScript("js/myScript.js");
                $('#searchItemDiv').hide();
                $('.ui.table.segment').hide();
                $('.ui.green.button.clear').click(function() {
                    $('#searchItemId').val('');
                    $('#searchItemName').val('');
                    $('#searchItemId').focus();
                    $('.ui.table.segment').hide();
                });
                $('.ui.blue.button').click(function() {
                    $('.left.sidebar').sidebar('toggle');
                });
                $('#searchItem').click(function() {
                    $('#itemUpdateForm').hide();
                    $('#itemAddForm').hide();
                    $('#searchItemDiv').show();
                    $('.ui.compact.celled.definition.table').hide();
                });
                $('#itemSearch').click(function() {
                    var option = {};
                    option.url = '${pageContext.request.contextPath}/search?action=itemSearch',
                            option.type = 'POST',
                            option.data = $('#searchForm').serialize(),
                            option.success = function(data) {
                        $('#itemSearchTable tbody').empty();
                        var itemDetails = JSON.parse(data);
                        var tableData = $('#itemSearchTable tbody');
                        var row = $('<tr></tr>').appendTo(tableData);
                        $('<td></td>').text(itemDetails.item_Id).appendTo(row);
                        $('<td></td>').text(itemDetails.item_Name).appendTo(row);
                        $('<td></td>').text(itemDetails.total_Items).appendTo(row);
                        $('<td></td>').text(itemDetails.price).appendTo(row);
                        $('<td></td>').text(itemDetails.storage_Date).appendTo(row);
                        $('<td></td>').text(itemDetails.soldItems).appendTo(row);
                        $('<td></td>').text(itemDetails.remainingItems).appendTo(row);
                        $('<td></td>').text(itemDetails.factoryName).appendTo(row);
                        $('.ui.table.segment').slideDown(1000);
                    },
                            option.error = function(error) {
                        console.log(error);
                    };
                    $.ajax(option);
                });
            });

        </script>
    </head>
    <body>
        <%

            response.setHeader("Cache-Control", "no-cache"); //Forces caches to obtain a new copy of the page from the origin server
            response.setHeader("Cache-Control", "no-store"); //Directs caches not to store the page under any circumstance
            response.setDateHeader("Expires", 0); //Causes the proxy cache to see the page as "stale"
            response.setHeader("Pragma", "no-cache"); //HTTP 1.0 backward compatibility

            Administrator admin1 = (Administrator) session.getAttribute("Admin");
            //String userName = (String) session.getAttribute("Admin");
            if (null == admin1) {
                request.setAttribute("Error", "Session has ended.  Please login.");
                RequestDispatcher rd = request.getRequestDispatcher("sessionTimeout.jsp");
                rd.forward(request, response);
            }
        %> 
        <div class="ui left vertical inverted labeled icon sidebar menu">
            <a class="item" href="addItems.jsp">
                <i class="add to cart icon"></i>
                Add Item
            </a>
            <a class="item" href="updateItems.jsp">
                <i class="edit icon"></i>
                Update Items
            </a>
            <a class="item" href="${pageContext.request.contextPath}/list?list=items">
                <i class="unhide icon"></i>
                View Items
            </a>
            <a class="item" href="${pageContext.request.contextPath}/list?list=pendingItems">
                <i class="cloud download icon"></i>
                Pending Items
            </a>
            <a class="item" href="#" id="searchItem">
                <i class="search icon"></i>
                Search Item
            </a>
            <a class="item" href="${pageContext.request.contextPath}/list?list=soldItems">
                <i class="external share icon"></i>
                Sold Items
            </a>
            <a class="item" href="${pageContext.request.contextPath}/menu.jsp">
                <i class="external share icon"></i>
                Home
            </a>
            <a class="item" href="${pageContext.request.contextPath}/logout">
                <i class="sign out icon"></i>
                Logout
            </a>
        </div>
        <div class="ui blue button">
            <i class="tasks icon"></i>Menu
        </div>

        <div class="ui one column middle aligned relaxed fitted stackable grid" id="searchItemDiv">
            <div class="column">
                <div class="ui form segment">
                    <form method="post" id="searchForm">
                        <div class="two fields">
                            <div class="field">
                                <label>Item Id</label>
                                <div class="ui left icon input">
                                    <input type="text" id="searchItemId" name="searchItemId" placeholder="Item Id"/>
                                    <i class="user icon"></i>
                                </div>
                            </div>
                            <div class="field">
                                <label>Item name</label>
                                <div class="ui left icon input">
                                    <input type="text" id="isearchItemName" name="searchItemName" placeholder="Item Name"/>
                                    <i class="user icon"></i>
                                </div>
                            </div>
                        </div>
                    </form>
                    <div class="field">
                        <div class="ui blue button" id="itemSearch">Get Details</div> 
                        <div class="ui green button clear">Clear</div>
                    </div>

                </div>
                <table class="ui table segment" id="itemSearchTable">
                    <thead>
                        <tr>
                            <th>Item Id</th>
                            <th>Item Name</th>
                            <th>Total Items</th>
                            <th>Price</th>
                            <th>Added Date</th>
                            <th>Sold Items</th>
                            <th>Rem Items</th>
                            <th>Factory Name</th>
                        </tr>
                    </thead>
                    <tbody></tbody>
                </table>
            </div>
        </div>
    </body>
</html>
